import React from 'react';
import { AutoComplete } from 'choerodon-ui';
import { SelectValue } from 'choerodon-ui/lib/select';
import { useAutoCompleteBasic } from './hooks';

const AutoCompleteCertainCategory: React.FC = () => {
  const [options, handleSearch] = useAutoCompleteBasic();

  const handleSelect = (value: SelectValue, option: Object) => {
    console.log(value);
    console.log(option);
  };

  return (
    <AutoComplete
      dropdownStyle={{ width: 300 }}
      style={{ width: '100%' }}
      // 因为在c7n中autocomplete的类型存在部分问题 当使用ts的时候不加dataSource无法编译通过 所以给了一个无用的空数组
      // 在c7n的高版本(0.61+)中对auto-complete的类型进行了优化 可不加 dataSource
      dataSource={[]}
      onSelect={handleSelect}
      onSearch={handleSearch}
      placeholder="input here"
      optionLabelProp="value"
    >
      {options}
    </AutoComplete>
  );
};

export default AutoCompleteCertainCategory;